<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>云收藏</title>
	<base target="_blank">
	<script src="http://47.106.66.89:8080/js/vue.min.js"></script>
	<script src="http://47.106.66.89:8080/js/axios.min.js"></script>
	<link href="http://47.106.66.89:8080/js/ele-2.15.7/theme-chalk/index.css" rel="stylesheet">
	<script src="http://47.106.66.89:8080/js/ele-2.15.7/index.js"></script>
</head>
<body>
<div id="app">
	<el-container>
		<el-main>
			<div class="c900 h100">
				<el-container class="h100">
					<el-aside class="h100">
						<el-menu class="h100" default-active="2">
							<el-menu-item index="a1">
								<el-button type="primary" @click="showEdit=true">修改密码</el-button>
							</el-menu-item>
						</el-menu>
					</el-aside>
				</el-container>
			</div>
		</el-main>
	</el-container>
	<el-dialog title="修改密码" :visible.sync="showEdit">
		<el-form>
			<el-form-item label="旧密码:" label-width="75px">
				<el-input v-model="oldPwd" type="password" placeholder="输入旧密码"></el-input>
			</el-form-item>
			<el-form-item label="新密码:" label-width="75px">
				<el-input v-model="newPwd" type="password" placeholder="新密码"></el-input>
			</el-form-item>
		</el-form>

		<div slot="footer" class="dialog-footer">
			<el-button @click="showEdit = false">取 消</el-button>
			<el-button type="primary" @click="updatePwd()">确 定</el-button>
		</div>
	</el-dialog>
</div>
</body>
<script>
	// /updatePwd
	var v = new Vue({
		el:"#app",
		data:{
			showEdit: false,
			oldPwd:'',
			newPwd:'',
			
		},
		created(){
		},


		methods:{

			updatePwd(){
				if (!this.oldPwd || !this.newPwd) {
					this.$message.error('请填写所有字段');
					return;
				}

				let p = new URLSearchParams();
				p.append("oldPwd",this.oldPwd);
				p.append("newPwd",this.newPwd);

				axios.post("updatePwd",p)
				.then(res=>{
					if(res.data.code == 1){
						this.$message(res.data.msg);
					}else {
						this.$alert(res.data.msg);
					}
				})
				.catch(error => {
                // console.error('更新密码时发生错误:', error);
                this.$message.error('服务器连接错误，请稍后再试');
            });;
			},

		}
	})
</script>
<style>
*{
		padding: 0;
		margin: 0;
	}
	
html,body,#app{
		width: 100%;
		height: 100%;
		font-size: 14px;
	}
	#app>.el-container>.el-main{
		overflow-x: hidden;
		background-image: url("https://img2.baidu.com/it/u=2076726300,191426335&fm=253&fmt=auto?w=500&h=500");
		background-size: cover;
	}
	.el-main{
		padding: 0px 10px;
	}

	html,body,#app,#app>.el-container{
		height: 100%;
	}

	a{
		text-decoration: none;
	}
	.c900{
		width: 1000px;
		margin: auto;
	}
	
	
	img{
		width: 40px;
		height: 40px;
		object-fit: cover;
	}

	
	.h100{
		height: 100%;
	}
	
</style>

</html>